@charset "utf-8";
@bgColorW:#ffffff;
@bgColorB:#24262F;
@bgColorGreen:#009688;
@bgColorBlue:#0180ff;
@bgColorPink:#AA3130;
@bgColorG:#3A3D49;
@ColorW:#fff;
@ColorB:#24262F;
/* skin-deepblue */
body {
    &.skin-deepblue{
        .layui-admin-skin{
            .layui-layer-title{
                background-color: @bgColorBlue;
                color: @ColorW;
            }
            .layui-layer-btn {
                .layui-layer-btn0{
                    border-color: @bgColorBlue;
                    background-color: @bgColorBlue;
                }
            }
        }
        .layui-btn:not(.layui-btn-primary):not(.layui-btn-normal):not(.layui-btn-warm):not(.layui-btn-danger):not(.layui-btn-disabled){
            background-color: @bgColorBlue;
        }
        .top-header{
            background-color: @bgColorBlue;
            .top-logo{
                color: @ColorW;
            }
            .layui-nav{
                background-color: @bgColorBlue;
                .layui-nav-item{
                    .layui-nav-child{
                        dd{
                            a{
                                &:hover{
                                    background-color: @bgColorBlue;
                                    color: @ColorW;
                                }
                            }
                        }
                    }
                }
            }
        }
        /* leftside */
        .layui-side {
            background-color: #fff;
            .layui-nav {
                background-color: transparent;
                .layui-nav-more {
                    border-color: #999 transparent transparent;
                }
                .layui-nav-itemed {
                    &>a {
                        .layui-nav-more {
                            border-color: transparent transparent #999;
                        }
                    }
                }
            }
            .layui-nav-itemed {
                & > a {
                    color: #555 !important;
                }
            }
        }
        /* tab */
        
    }
    &.skin-pink{
        .layui-admin-skin{
            .layui-layer-title{
                background-color: @bgColorPink;
                color: @ColorW;
            }
            .layui-layer-btn {
                .layui-layer-btn0{
                    border-color: @bgColorPink;
                    background-color: @bgColorPink;
                }
            }
        }
        .layui-btn:not(.layui-btn-primary):not(.layui-btn-normal):not(.layui-btn-warm):not(.layui-btn-danger):not(.layui-btn-disabled){
            background-color: @bgColorPink;
        }
        /* layer重置css end */
        .top-header{
            background-color: @bgColorPink;
            .top-logo{
                color: @ColorW;
            }
            .layui-nav{
                background-color: @bgColorPink;
                .layui-nav-item{
                    .layui-nav-child{
                        dd{
                            a{
                                &:hover{
                                    background-color: @bgColorPink;
                                    color: @ColorW;
                                }
                            }
                        }
                    }
                }
            }
        }
        /* leftside */
        .left-side{
            background-color: @bgColorW;
            .left-seraph{
                box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
                color: @ColorB;
            }
            .left-side-scroll{
                .left-nav-tree{
                    .left-nav-item{
                        .link{
                            color: @ColorB;
                            opacity: 1;
                            &.left-this{
                                background-color: @bgColorPink;
                            }
                            &:hover{
                                background-color: @bgColorPink;
                            }
                        }
                    }
                    .left-nav-more{
                        border-top-color:rgba(0, 0, 0, 0.7);
                    }
                    .left-nav-child{
                        background-color: @bgColorW;
                    }
                    .unfolded>.link .left-nav-more{
                        border-color: transparent transparent #000;
                    }
                    .unfolded>.link:hover .left-nav-more{
                        border-color: transparent transparent #fff;
                    }
                }
            }
        }
        /* tab */
        .page-tab{
            .page-tab-content{
                .menu-list{
                    a{
                        &.active{
                            &:after{
                                background-color: @bgColorPink;
                            }
                        } 
                    }
                }
            }
            .page-operation{
                .menu-all{
                    .menu-all-ul{
                        li{
                            a{
                                &:hover{
                                    background-color: @bgColorPink;
                                    color: @ColorW;
                                }
                            }
                        }
                    } 
                }
            }
        }
    }
    &.skin-green{
        .layui-admin-skin{
            .layui-layer-title{
                background-color: @bgColorGreen;
                color: @ColorW;
            }
            .layui-layer-btn {
                .layui-layer-btn0{
                    border-color: @bgColorGreen;
                    background-color: @bgColorGreen;
                }
            }
        }
        .layui-btn:not(.layui-btn-primary):not(.layui-btn-normal):not(.layui-btn-warm):not(.layui-btn-danger):not(.layui-btn-disabled){
            background-color: @bgColorGreen;
        }
        /* layer重置css end */

        .top-header{
            background-color: @bgColorGreen;
            .top-logo{
                color: @ColorW;
            }
            .layui-nav{
                background-color: @bgColorGreen;
                .layui-nav-item{
                    .layui-nav-child{
                        dd{
                            a{
                                &:hover{
                                    background-color: @bgColorGreen;
                                    color: @ColorW;
                                }
                            }
                        }
                    }
                }
            }
        }
        /* leftside */
        .left-side{
            background-color: @bgColorW;
            .left-seraph{
                box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
                color: @ColorB;
            }
            .left-side-scroll{
                .left-nav-tree{
                    .left-nav-item{
                        .link{
                            color: @ColorB;
                            opacity: 1;
                            &.left-this{
                                background-color: @bgColorGreen;
                            }
                            &:hover{
                                background-color: @bgColorGreen;
                            }
                        }
                    }
                    .left-nav-more{
                        border-top-color:rgba(0, 0, 0, 0.7);
                    }
                    .left-nav-child{
                        background-color: @bgColorW;
                    }
                    .unfolded>.link .left-nav-more{
                        border-color: transparent transparent #000;
                    }
                    .unfolded>.link:hover .left-nav-more{
                        border-color: transparent transparent #fff;
                    }
                }
            }
        }
        /* tab */
        .page-tab{
            .page-tab-content{
                .menu-list{
                    a{
                        &.active{
                            &:after{
                                background-color: @bgColorGreen;
                            }
                        } 
                    }
                }
            }
            .page-operation{
                .menu-all{
                    .menu-all-ul{
                        li{
                            a{
                                &:hover{
                                    background-color: @bgColorGreen;
                                    color: @ColorW;
                                }
                            }
                        }
                    } 
                }
            }
        }
    }
}